<template>
  <div class="err-container">
    <div>
      <el-button type="info" size="medium" @click="backNav">
        <i class="el-icon-arrow-left"></i>
        返回</el-button>
    </div>
    <el-row>
      <el-col :span="12">
        <div class="err-401-content">
          <h1 class="text-jumbo">Oops!</h1>
          <h2>您的权限似乎不足~</h2>
          <h6>如果有意见请联系您的上级</h6>
        </div>
      </el-col>
      <el-col :span="12">
        <div class="err-401-content">
          <img src="@/assets/images/static/928354048753Fried_Egg.gif" alt="">
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  methods: {
    backNav() {
      this.$router.go(-1);
    }
  }

}
</script>

<style>
.err-401-content {
  animation: sideRight 0.5s;
}

.text-jumbo {
  font-size: 56px;
  font-weight: 700;
  color: #484848;
}

@keyframes sideRight {
  0% {
    transform: translateX(60px);
    opacity: 0;
  }

  100% {
    transform: translateX(0px);
    opacity: 1;
  }
}
</style>